<!--
 * @页面名称:全文权限管理
 * @描述: 
 * @作者: 
 * @Date:
-->
<template>
  <div class="card fulltextAuth">
    <splitpanes :dbl-click-splitter="false" style="background-color: #fff; display: flex; height: 100%">
      <pane size="15">
        <ztree :setting="treeSetting.setting" :nodes="treeSetting.treeData" @onClick="onClick"></ztree>
      </pane>
      <pane size="85">
        <el-form :inline="true" :model="formData" :rules="formRules" ref="FormRef" class="demo-form-inline">
          <el-form-item label="门类:" prop="FM_ID">
            <el-select placeholder="请选择门类" v-model="formData.FM_ID" @change="FMChange">
              <el-option v-for="item in FMOptions" :key="item.FM_ID" :label="item.FM_OCName" :value="item.FM_ID" />
            </el-select>
          </el-form-item>
          <el-form-item label="角色:" prop="RoleID">
            <el-select placeholder="请选择角色" v-model="formData.RoleID">
              <el-option v-for="item in RoleOptions" :key="item.G_ID" :label="item.G_Name" :value="item.G_ID" />
            </el-select>
          </el-form-item>
          <el-form-item label="类型:" prop="FMT_ID">
            <el-select placeholder="请选择类型" v-model="formData.FMT_ID" @change="FMTChange">
              <el-option v-for="item in TypeOptions" :key="item.FMT_ID" :label="item.FMT_Name" :value="item.FMT_ID" />
            </el-select>
          </el-form-item>
          <el-form-item label="分类:">
            <el-tree-select
              style="width: 100%"
              check-strictly
              v-model="formData.Catalog_ID"
              node-key="Catalog_ID"
              :props="{ label: 'Catalog_Name', children: 'children' }"
              :data="CatalogData"
              :render-after-expand="false"
            />
          </el-form-item>
        </el-form>
        <el-space style="margin-bottom: 10px">
          <el-button :disabled="btnDisabled" type="danger" @click="del">批量删除</el-button>
          <el-input v-model="searchVal" style="max-width: 600px" placeholder="请输入搜索条件">
            <template #append>
              <el-button @click="getTableData">搜索</el-button>
            </template>
          </el-input>
        </el-space>
        <el-tabs v-model="activeName" @tab-change="tabChange">
          <el-tab-pane :label="tabName" name="1">
            <stable
              style="height: 100%"
              :columns="tableSetting.columns"
              :data="tableSetting.data"
              :tablePage="tablePage"
              :pageSizes="[10, 20, 50, 100, { label: '全部数据', value: -1 }]"
              @selectionChange="selectChange"
              @pageChange="pageChange"
            ></stable>
          </el-tab-pane>
          <el-tab-pane label="全文" name="2">
            <stable
              style="height: 100%"
              :columns="tableSetting.columns2"
              :data="tableSetting.data2"
              :tablePage="tablePage"
              :pageSizes="[10, 20, 50, 100, { label: '全部数据', value: -1 }]"
              @selectionChange="selectChange"
              @pageChange="pageChange"
            ></stable>
          </el-tab-pane>
        </el-tabs>
      </pane>
    </splitpanes>
    <!-- 新增修改弹框 -->
    <modal v-model:visible="modalSetting.visible" :title="modalSetting.title" @ok="ok">
      <el-form :model="formData2">
        <el-row>
          <el-col :span="12">
            <el-form-item label="是否禁止显示:">
              <el-checkbox v-model="formData2.isShow"></el-checkbox>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="是否禁止打开全文:">
              <el-checkbox v-model="formData2.isOpen"></el-checkbox>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="是否禁止打印全文:">
              <el-checkbox v-model="formData2.isPrint"></el-checkbox>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="是否禁止下载全文:">
              <el-checkbox v-model="formData2.isDownload"></el-checkbox>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </modal>
  </div>
</template>

<script setup lang="tsx">
import { ref, reactive, onMounted } from "vue";
import Ztree from "@/components/Ztree/Ztree.vue";
import { useDictionryStore } from "@/stores/modules/dictionary";
import { useCatalogStore } from "@/stores/modules/catalog";
import { useAppStore } from "@/stores/modules/app";
import { Splitpanes, Pane } from "splitpanes";
import "splitpanes/dist/splitpanes.css";
import { transTree } from "@/utils/util";
import { fileSizeFormat } from "@/utils/formatter";
import useCurrentInstance from "@/utils/useCurrentInstance";
import ACrypto from "@/utils/crypto";

const { proxy } = useCurrentInstance();
// tree配置
const treeSetting = reactive({
  setting: {
    // ztree配置
    data: {
      simpleData: {
        enable: true,
        idKey: "Fonds_ID",
        pIdKey: "Fonds_Father"
      },
      key: {
        name: "Fonds_Name"
      }
    },
    view: {
      showIcon: false
    }
  },
  treeData: [],
  treeNode: {} as any
});
// pinia数据
const dictionryStore = useDictionryStore();
const appStore = useAppStore();
const catalogStore = useCatalogStore();
// 格式化表格
const formatter = ({ row, column, cellValue }: any) => {
  const catalogList = catalogStore.catalogList;
  // 保管期限
  if (column.property === "RetentionPeriod") {
    const BGQX = dictionryStore.getDictionaryObj["BGQXdata"];
    const data = BGQX.find((v: any) => v.DDL_ID === cellValue);
    return data ? data.DDL_Name : "";
  }
  // 分类
  if (column.property === "Catalog_ID") {
    const data = catalogList.find((v: any) => v.Catalog_ID === cellValue);
    return data ? data.Catalog_Name : "";
  }
  if (column.property === "Title") {
    cellValue = ACrypto.getSS(row[column.property]);
  }
  return cellValue;
};
// table配置
const tableSetting = reactive({
  columns: [
    { type: "checkbox", width: 55 },
    { field: "Code", title: "档号", sortable: true, width: 150 },
    { field: "Title", title: "题名", sortable: true, width: 400, formatter: formatter },
    { field: "RetentionPeriod", title: "保管期限", sortable: true, width: 150, formatter: formatter },
    {
      field: "IsBanOnDisplay",
      title: "是否禁止显示",
      width: 150,
      sortable: true,
      slots: {
        default: ({ row }: any) => {
          return [
            <div>
              <el-checkbox disabled v-model={row.IsBanOnDisplay} />
            </div>
          ];
        }
      } as any
    },
    {
      field: "IsBanOnOpen",
      title: "是否禁止打开全文",
      sortable: true,
      width: 150,
      slots: {
        default: ({ row }: any) => {
          return [
            <div>
              <el-checkbox disabled v-model={row.IsBanOnOpen} />
            </div>
          ];
        }
      } as any
    },
    {
      field: "IsBanOnPrint",
      title: "是否禁止打印全文",
      sortable: true,
      width: 150,
      slots: {
        default: ({ row }: any) => {
          return [
            <div>
              <el-checkbox disabled v-model={row.IsBanOnPrint} />
            </div>
          ];
        }
      } as any
    },
    {
      field: "IsBanOnDownload",
      title: "是否禁止下载全文",
      sortable: true,
      width: 150,
      slots: {
        default: ({ row }: any) => {
          return [
            <div>
              <el-checkbox disabled v-model={row.IsBanOnDownload} />
            </div>
          ];
        }
      } as any
    },
    {
      width: 80,
      title: "操作",
      fixed: "right",
      slots: {
        default: ({ row }: any) => {
          return [
            <el-link type="primary" underline={false} onClick={() => edit(row)}>
              修改
            </el-link>
          ];
        }
      }
    }
  ],
  columns2: [
    { type: "checkbox", width: 55 },
    { field: "AI_Name", title: "全文名称", sortable: true },
    { field: "AI_Source_Size", title: "文件大小", sortable: true, formatter: fileSizeFormat },
    { field: "AI_UploadDateTime", title: "上传时间", sortable: true },
    {
      field: "IsBanOnDisplay",
      title: "是否禁止显示",
      width: 150,
      sortable: true,
      slots: {
        default: ({ row }: any) => {
          return [
            <div>
              <el-checkbox disabled v-model={row.IsBanOnDisplay} />
            </div>
          ];
        }
      } as any
    },
    {
      field: "IsBanOnOpen",
      title: "是否禁止打开全文",
      sortable: true,
      width: 150,
      slots: {
        default: ({ row }: any) => {
          return [
            <div>
              <el-checkbox disabled v-model={row.IsBanOnOpen} />
            </div>
          ];
        }
      } as any
    },
    {
      field: "IsBanOnPrint",
      title: "是否禁止打印全文",
      sortable: true,
      width: 150,
      slots: {
        default: ({ row }: any) => {
          return [
            <div>
              <el-checkbox disabled v-model={row.IsBanOnPrint} />
            </div>
          ];
        }
      } as any
    },
    {
      field: "IsBanOnDownload",
      title: "是否禁止下载全文",
      sortable: true,
      width: 150,
      slots: {
        default: ({ row }: any) => {
          return [
            <div>
              <el-checkbox disabled v-model={row.IsBanOnDownload} />
            </div>
          ];
        }
      } as any
    },
    {
      width: 80,
      title: "操作",
      slots: {
        default: ({ row }: any) => {
          return [
            <el-link type="primary" underline={false} onClick={() => edit(row)}>
              修改
            </el-link>
          ];
        }
      }
    }
  ],
  data: [] as any[],
  data2: [] as any[],
  rowClickObj: {} as any, // 业务数据单击保存对象
  rowClickObj2: {} as any, // 全文数据单击保存对象
  selectData: [] as any[], // 业务数据多选保存对象
  selectData2: [] as any[] // 全文数据多选保存对象
});
// 分页配置
const tablePage = reactive({
  showPage: true,
  pageIndex: 1,
  pageSize: 20,
  total: 0
});
// 表单绑定字段
const formData = reactive({
  FM_ID: undefined,
  FMT_ID: undefined,
  RoleID: undefined,
  Catalog_ID: undefined
});
// 表单规则
const formRules = reactive({
  FM_ID: [{ required: true, message: "请选择门类数据", trigger: "blur" }],
  RoleID: [{ required: true, message: "请选择角色", trigger: "blur" }],
  FMT_ID: [{ required: true, message: "请选择类型", trigger: "blur" }]
});
// 表单实例
const FormRef = ref();
// 门类数据
const FMOptions = ref<any[]>([]);
// 角色数据
const RoleOptions = ref<any[]>([]);
// 类型数据
const TypeOptions = ref<any[]>([]);
// 分类数据
const CatalogData = ref<any[]>([]);
// 按钮状态控制
const btnDisabled = ref(true);
// 搜索关键字
const searchVal = ref("");
// tab页绑定字段
const activeName = ref("1");
// tab页名称
const tabName = ref("案卷");
// 修改弹框配置
const modalSetting = reactive({
  visible: false,
  title: "修改"
});
// 弹框表单配置
const formData2 = reactive({
  isShow: false,
  isOpen: false,
  isPrint: false,
  isDownload: false
});
// 获取全宗树
const getFondsData = () => {
  proxy.$vueAxios.get("MasterBaseFonds/GetFondsTree").then((res: any) => {
    treeSetting.treeData = res.List;
  });
};
// 树节点点击事件
const onClick = (treeNode: any) => {
  treeSetting.treeNode = treeNode;
  getFM();
};
// 获取门类数据
const getFM = () => {
  proxy.$vueAxios.get("DynamicStatistics/GetFM", { fondsID: treeSetting.treeNode.Fonds_ID }).then((res: any) => {
    FMOptions.value = res.List;
  });
};
// 获取角色数据
const getRole = () => {
  proxy.$vueAxios.get("Master_Base_Groups/Get", { order: "G_Order asc" }, { noLoading: true }).then((res: any) => {
    RoleOptions.value = res.List;
  });
};
// 获取表类型数据
const getTypeData = () => {
  proxy.$vueAxios
    .post(
      "Master_Base_FormModel_Table/GetConditional",
      {
        order: "FMT_Type ASC",
        dtoList: [
          {
            fieldName: "FM_ID",
            fieldValue: formData.FM_ID
          }
        ]
      },
      {
        noLoading: true
      }
    )
    .then((res: any) => {
      TypeOptions.value = res.List;
    });
};
// 获取分类数据
const getCatalogData = () => {
  proxy.$vueAxios.get("DynamicStatistics/GetCatalog", { fmid: formData.FM_ID }, { noLoading: true }).then((res: any) => {
    CatalogData.value = transTree(res.List, "Catalog_ID", "Catalog_Father");
  });
};
// 门类选择事件
const FMChange = () => {
  formData.Catalog_ID = undefined;
  formData.FMT_ID = undefined;
  getCatalogData();
  getTypeData();
};
// 类型选择事件
const FMTChange = (val: any) => {
  tabName.value = TypeOptions.value.filter((v: any) => v.FMT_ID == val)[0].FMT_Name;
};
// 获取权限数据
const getTableData = () => {
  FormRef.value?.validate((valid: any) => {
    if (valid) {
      if (activeName.value === "1") {
        const params = {
          gid: formData.RoleID,
          fmid: formData.FM_ID,
          fmtid: formData.FMT_ID,
          catalogid: formData.Catalog_ID,
          keyword: searchVal.value,
          searchType: 1,
          pageIndex: tablePage.pageIndex,
          pageSize: tablePage.pageSize
        };
        proxy.$vueAxios.get("MasterBaseGUDataPermission/Get", params, { noLoading: true }).then((res: any) => {
          tableSetting.data = res.List;
          tablePage.total = res.Count;
        });
      } else if (activeName.value === "2") {
        const params = {
          gid: formData.RoleID,
          fmid: formData.FM_ID,
          fmtid: formData.FMT_ID,
          catalogid: formData.Catalog_ID,
          keyword: searchVal.value,
          searchType: 1,
          pageIndex: tablePage.pageIndex,
          pageSize: tablePage.pageSize
        };
        proxy.$vueAxios.get("MasterBaseGUDataPermission/GetAllInfos", params, { noLoading: true }).then((res: any) => {
          tableSetting.data2 = res.List;
          tablePage.total = res.Count;
        });
      }
    }
  });
};
// 表格勾选事件
const selectChange = (val: any) => {
  if (activeName.value == "1") {
    tableSetting.selectData = val;
  } else if (activeName.value == "2") {
    tableSetting.selectData2 = val;
  }
  if (val.length > 0) {
    btnDisabled.value = false;
  } else {
    btnDisabled.value = true;
  }
};
// 表格分页切换事件
const pageChange = ({ pageIndex, pageSize }: any) => {
  tablePage.pageIndex = pageIndex;
  tablePage.pageSize = pageSize;
  getTableData();
};
// 修改表格数据
const edit = (row: any) => {
  if (activeName.value == "1") {
    tableSetting.rowClickObj = row;
  } else if (activeName.value == "2") {
    tableSetting.rowClickObj2 = row;
  }
  modalSetting.visible = true;
  formData2.isShow = row.IsBanOnDisplay;
  formData2.isOpen = row.IsBanOnOpen;
  formData2.isPrint = row.IsBanOnPrint;
  formData2.isDownload = row.IsBanOnDownload;
};
// 修改弹框确认事件
const ok = () => {
  if (activeName.value === "1") {
    const params = {
      gudP_ID: tableSetting.rowClickObj.GUDP_ID,
      g_ID: formData.RoleID,
      fonds_ID: treeSetting.treeNode.Fonds_ID,
      fM_ID: formData.FM_ID,
      fmT_ID: formData.FMT_ID,
      catalog_ID: formData.Catalog_ID,
      data_ID: tableSetting.rowClickObj.Record_ID,
      isBanOnDisplay: formData2.isShow,
      isBanOnOpen: formData2.isOpen,
      isBanOnPrint: formData2.isPrint,
      isBanOnDownload: formData2.isDownload
    };
    proxy.$vueAxios.post("MasterBaseGUDataPermission/Update", params).then((res: any) => {
      if (res.Mark) {
        modalSetting.visible = false;
        getTableData();
      }
    });
  } else if (activeName.value === "2") {
    const params = {
      gudP_ID: tableSetting.rowClickObj2.GUDP_ID,
      g_ID: formData.RoleID,
      fonds_ID: treeSetting.treeNode.Fonds_ID,
      fM_ID: formData.FM_ID,
      fmT_ID: formData.FMT_ID,
      catalog_ID: formData.Catalog_ID,
      data_ID: tableSetting.rowClickObj2.AI_ID,
      isBanOnDisplay: formData2.isShow,
      isBanOnOpen: formData2.isOpen,
      isBanOnPrint: formData2.isPrint,
      isBanOnDownload: formData2.isDownload
    };
    proxy.$vueAxios.post("MasterBaseGUDataPermission/UpdateAllInfos", params).then((res: any) => {
      if (res.Mark) {
        modalSetting.visible = false;
        getTableData();
      }
    });
  }
};
// 删除事件
const del = async () => {
  const { LoadingConfig } = appStore;
  if (activeName.value == "1") {
    let deleteFailed = false; // 定义一个变量来标记是否有删除失败
    for (let i = 0; i < tableSetting.selectData.length; i++) {
      LoadingConfig.contentLoading = true;
      LoadingConfig.contentTip = `删除数据${i}/${tableSetting.selectData.length}`;
      const params = { gudP_ID: tableSetting.selectData[i].GUDP_ID };
      const Res = await proxy.$vueAxios.post("MasterBaseGUDataPermission/Delete", params, { noLoading: true });
      if (Res.Mark) {
        LoadingConfig.contentLoading = false;
        tableSetting.data.splice(
          tableSetting.data.findIndex((v: any) => v.Record_ID === tableSetting.selectData[i].Record_ID),
          1
        );
      } else {
        deleteFailed = true; // 标记删除失败
      }
    }
    if (deleteFailed) {
      LoadingConfig.contentLoading = false;
      proxy.$message({
        type: "error",
        message: "删除失败!"
      });
    } else {
      proxy.$message({
        type: "success",
        message: "删除成功!"
      });
    }
  } else if (activeName.value == "2") {
    let deleteFailed = false; // 定义一个变量来标记是否有删除失败
    for (let i = 0; i < tableSetting.selectData2.length; i++) {
      LoadingConfig.contentLoading = true;
      LoadingConfig.contentTip = `删除数据${i}/${tableSetting.selectData2.length}`;
      const params = { gudP_ID: tableSetting.selectData2[i].GUDP_ID };
      const Res = await proxy.$vueAxios.post("MasterBaseGUDataPermission/Delete", params, { noLoading: true });
      if (Res.Mark) {
        LoadingConfig.contentLoading = false;
        tableSetting.data2.splice(
          tableSetting.data2.findIndex((v: any) => v.Record_ID === tableSetting.selectData2[i].Record_ID),
          1
        );
      } else {
        deleteFailed = true; // 标记删除失败
      }
    }
    if (deleteFailed) {
      LoadingConfig.contentLoading = false;
      proxy.$message({
        type: "error",
        message: "删除失败!"
      });
    } else {
      proxy.$message({
        type: "success",
        message: "删除成功!"
      });
    }
  }
};
// tab栏切换事件
const tabChange = () => {
  getTableData();
  tablePage.pageIndex = 1;
  tablePage.pageSize = 20;
};
onMounted(() => {
  getFondsData();
  getRole();
});
</script>

<style scoped lang="scss">
.fulltextAuth {
  height: 100%;
  .el-tabs {
    height: calc(100% - 92px);
    :deep(.el-tabs__content) {
      height: calc(100% - 55px);
      .el-tab-pane {
        height: 100%;
      }
    }
  }
}
</style>
